// 定义底部记分牌的类
export default class ScorePanel {
  SCOREKEY:string = 'score'   // 存取 score 的 key
  LEVELKEY:string = 'level'   // 存取 level 的 key
  score = 0;    // 积分
  level = 1;    // 等级
  scoreEle:HTMLElement;
  levelEle:HTMLElement;
  // 最高等级, 默认 10
  maxLevel:number;
  upNum: number;  // 多少分升一级 默认 10

  newScore:HTMLElement      // 本次游戏所得分数的el
  oldScore:HTMLElement      // 历史最高得分的el
  newLevel:HTMLElement      // 本次游戏所达等级的el
  oldLevel:HTMLElement      // 历史最高等级的el

  // 顶部的 tip
  tipEl:HTMLElement

  constructor(maxLevel: number = 10, upNum: number = 10) {
    this.newScore = document.querySelector('#newScore') as HTMLElement
    this.oldScore = document.querySelector('#oldScore') as HTMLElement
    this.newLevel = document.querySelector('#newLevel') as HTMLElement
    this.oldLevel = document.querySelector('#oldLevel') as HTMLElement
    this.tipEl = document.querySelector('.tip') as HTMLElement
    this.scoreEle = document.querySelector('.score')!;
    // console.log('积分', this.scoreEle);
    
    this.levelEle = document.querySelector('.level')!;
    // console.log('等级', this.levelEle);
    
    this.maxLevel = maxLevel
    this.upNum = upNum
  }
  // 设置一个加分的方法
  addScore() {
    this.scoreEle.innerText = ++this.score + ''
    this.scoreEle.style.color = this.score > 30 ? '#f94e3b' : '#fa230b'
    this.newScore.innerText = this.scoreEle.innerText
    
    // 判断份数，根据份数进行升级
    if(this.score % this.upNum === 0) {
      this.addLevel()
    }
    this.checkHistory()   // 判断是否需要更新历史数据
  }
  // 设置一个升级的方法
  addLevel() {
    // 只能升级到最高等级（等级越高难度越大）
    if(this.level <= this.maxLevel) {
      this.levelEle.innerText = ++this.level + ''
      this.newLevel.innerText = this.levelEle.innerText
      this.levelEle.style.color = '#05d8fd'
      if(this.level > 3) return this.levelEle.style.color = '#F90773'
      if(this.level < 7) return this.levelEle.style.color = '#FD053F'
      if(this.level > 7) return this.levelEle.style.color = '#FD1C04'
    }
  }
  // 定义一个重置数据的方法
  resetData() {
    this.score = 0
    this.scoreEle.innerText = '0'
    this.level = 1
    this.levelEle.innerText = '1'
  }
  // 定义一个方法判断当前得分是否需要更新为历史最高(同时也会为当前的历史记录赋值)
  checkHistory() {
    const oldScore = localStorage.getItem(this.SCOREKEY) || 0
    if(this.score > oldScore || this.oldScore.innerText === '无历史') {
      localStorage.clear()
      localStorage.setItem(this.SCOREKEY, this.score + '')   // 本地存储最高得分
      localStorage.setItem(this.LEVELKEY, this.level + '')   // 本地存储最高等级
    }
    this.oldScore.innerText = localStorage.getItem(this.SCOREKEY) ? (localStorage.getItem(this.SCOREKEY) + '') : '无历史'
    this.oldLevel.innerText = localStorage.getItem(this.LEVELKEY) ? (localStorage.getItem(this.LEVELKEY) + '') : '无历史'
  }
  // 定义一个游戏开始时清空上一次游戏结算时的得分的方法
  gameStart() {
    this.newScore.innerText = '0'
    this.newLevel.innerText = '1'
  }
  // 控制 tip 的显示与隐藏的方法 true 显示 false 隐藏，默认显示
  setTip(tag: boolean = true) {
    if(tag) return this.tipEl.style.display = 'block'
    this.tipEl.style.display = 'none'
  }
}